﻿@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Beauty Index</title>
    <!-[if lt IE9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]->
    <link href="~/Content/Beauty.css" rel="stylesheet" />
    <script src="~/Scripts/Beauty.js"></script>
    <!-- plugin, stylesheet -->
    <link href="~/Content/aaAccordion.css" rel="stylesheet"  media="screen"/>

    <!-- jQuery, addons -->
    <script src="~/Scripts/jquery-1.8.2.min.js"></script>

    <!-- plugin, addons -->
    <script src="~/Scripts/aaAccordion.class.js"></script>

    <!-- javascript, inline code -->
    <script type="text/javascript">
        jQuery(document).ready(function () {
            jQuery('#firstAcc').aaAccordion({
                animationSpeed: 350,
                easing: 'easeOutQuad',
                startWidth: 500,
                margin: 0,
                firstOpen: 1,
                startAfter: 1300,
                itemWidth: 500,
                itemHeight: 500,
                firstOpen: 1,
                hoverGray: true,
                keyBrowse: true,
                pauseOnHover: true,
                autoplay: true, // autoplay easing
                autoplaySpeed: 3000 // autoplay interval speed
            });
        });
    </script>
</head>
<body>
    <header>
        <div id="header_content">
            <div class="header_left">
                <h1 class="logo"><a href="/"></a></h1>
                <h2 class="sub_logo"></h2>
            </div>
            <div class="header_right">
                <a href="/" data-linkid="6" class="icon_home"></a>
            </div>
        </div>
    </header>
    <nav>
        <div id="nav_content">
            <a href="#" class="select">最新</a>
            <a href="#">国内</a>
            <a href="#">国际</a>
            <a href="#">社会</a>
            <a href="#">军事</a>
            <a href="#">体育</a>
            <a href="#">娱乐</a>
            <a href="#">自然</a>
        </div>
    </nav>
    <div id="body">
        <div id="body_content">
        </div>
            <div class="aaAccordion" id="firstAcc">
                <div class="content">
                    <ul>
                        <li>
                            <a href="#" class="full-img">
                                <img src="~/Images/1.jpg" alt="img title" /></a>
                            <div class="caption">
                                <h1>Brunette girl & hair flower</h1>
                                <p>Vestibulum sagittis nunc ac urna aliquam viverra. Pellentesque sem quam, bibendum id dapibus non, ornare quis mi. Ut leo odio, vehicula ac mattis id, dignissim vel dui. </p>
                                <a href="#" class="go-btn">go button</a>
                            </div>
                        </li>
                        <li>
                            <a href="#" class="full-img">
                                <img src="~/Images/2.jpg" alt="img title" /></a>
                            <div class="caption">
                                <h1>Lost princess of the castle</h1>
                                <p>Integer libero sem, vestibulum non mollis sed, convallis vitae nunc..</p>
                                <a href="#" class="go-btn">go button</a>
                            </div>
                        </li>
                        <li>
                            <a href="#" class="full-img">
                                <img src="~/Images/3.jpg" alt="img title" /></a>
                            <div class="caption">
                                <h1>Peacock green lady</h1>
                                <p>tiam condimentum suscipit nulla, ut egestas nisl tempor eu. Etiam vel diam urna, in venenatis justo. Cras euismod fermentum adipiscing. </p>
                                <a href="#" class="go-btn">go button</a>
                            </div>
                        </li>
                        <li>
                            <a href="#" class="full-img">
                                <img src="~/Images/4.jpg" alt="img title" /></a>
                            <div class="caption">
                                <h1>Peachy & sensual</h1>
                                <p>Suspendisse tincidunt est ac risus tempus ut consectetur metus molestie. Curabitur purus est, lobortis in pulvinar non, molestie vitae turpis.</p>
                                <a href="#" class="go-btn">go button</a>
                            </div>
                        </li>
                        <li>
                            <a href="#" class="full-img">
                                <img src="~/Images/5.jpg" alt="img title" /></a>
                            <div class="caption">
                                <h1>Purple & pink!</h1>
                                <p>Rullam in orci sed dolor aliquam semper vel in arcu. Donec tempor porttitor arcu, non lacinia tellus luctus eu. </p>
                                <a href="#" class="go-btn">go button</a>
                            </div>
                        </li>

                    </ul>
                </div>
            </div>

            <div class="deco">
                <div class="decoL"></div>
                <div class="decoF"></div>
            </div>
    </div>
    <footer>
        关于本站|官方微博|hao123浏览器|常见问题|意见反馈上网导航第一品牌 - 京ICP证030173号
        <br />
        Copyright ©2013 张晓亮（David.A.Zhang）
    </footer>
</body>
</html>
